<template>
	<view class="my-box">
		<view class="bg-box">
			<view class="img-box">
				<image class="img-header" :src="togoForm.logo" mode="scaleToFill" lazy-load="true" v-if="togoForm.logo !== 'null'"></image>
				<image class="img-header" src="../../../../static/user.jpg" mode="scaleToFill" lazy-load="true" v-else></image>
				<!-- <image src="../../../../static/user.jpg" mode="scaleToFill" lazy-load="true" v-else></image> -->
			</view>
			<view class="info-box">
				<u-line color="#efefef" />
				<u-row gutter="0">
					<u-col span="4">
						<view class="info-left">姓名</view>
					</u-col>
					<u-col span="8"><input type="text" class="info-right" placeholder="请输入姓名" v-model="form.name" :disabled="isEdit"></input></u-col>
				</u-row>
				<u-line color="#efefef" />
				<u-row gutter="0">
					<u-col span="4">
						<view class="info-left">电话</view>
					</u-col>
					<u-col span="8"><input type="text" class="info-right" placeholder="请输入电话号码" v-model="form.phone" :disabled="isEdit"></input></u-col>
				</u-row>
				<u-line color="#efefef" />
				<u-row gutter="0">
					<u-col span="4">
						<view class="info-left">账号</view>
					</u-col>
					<u-col span="8"><input type="text" class="info-right" placeholder="请输入账号" v-model="form.username" :disabled="isEdit"></input></u-col>
				</u-row>
				<u-line color="#efefef" />
				<u-row gutter="0">
					<u-col span="4">
						<view class="info-left">负责项目</view>
					</u-col>
					<u-col span="8"><input type="text" class="info-right" placeholder="请输入密码" v-model="zanwu" :disabled="isEdit"></input></u-col>
				</u-row>
				<!-- 				<u-row gutter="0">
					<u-col span="6"><view class="info-left">项目</view></u-col>
					<u-col span="6"><view class="info-right">{{nameZh}}</view></u-col>
					<u-col span="6"><input type="text" class="info-right" placeholder="请输入项目" v-model="form.nameZh" :disabled="isEdit"></input></u-col>
				</u-row> -->
			</view>
		</view>
		<view class="btn-box">
			<u-button class="btn-item" :class="{edit: isEdit}" type="primary" @tap="gotoEdit()">编辑</u-button>
			<!-- <u-button class="btn-item" type="error" @tap="deleteUser()">{{isEdit?'删除':'取消'}}</u-button> -->
		</view>
	</view>
</template>

<script>
	import {
		deleteUser,
		updateUser
	} from "@/api/user.js"
	export default {
		data() {
			return {
				num: 123.453,
				barbg: {
					background: '#5c92ff'
				},
				backText: {
					color: '#FFFFFF'
				},
				logo: null,
				form: {},
				isEdit: true,
				id: null,
				zanwu: "暂无",
				togoForm: null
			};
		},
		onLoad(option) {
			// this.form = option
			this.togoForm = option
			this.form.name = option.name
			this.form.phone = option.phone
			this.form.username = option.username
			// this.form.depName = option.depName
			this.id = option.id
			console.log(this.logo)
		},
		methods: {
			gotoEdit() {
				this.$urlTo.togo('./edituser/edituser', this.togoForm)
			},
			editUser() {
				// if(this.isEdit === true){
				// 	this.isEdit = false
				// }else{
				// 	this.isEdit = true
				// 	updateUser(this.id , this.form).then(res =>{
				// 		console.log(res)
				// 		uni.showToast({
				// 			title: res.msg,
				// 			icon: "none"
				// 		})
				// 		if(res.code !==1){
				// 			return
				// 		}
				// 		setTimeout(() => {
				// 			var item = true; //item为要传的值
				// 			var pages = getCurrentPages();
				// 			var prevPage = pages[pages.length - 2];
				// 			prevPage.delete = item;
				// 			uni.navigateBack()
				// 		}, 500)

				// 	})
				// 	// console.log(this.form)
				// }
			},
			deleteUser() {
				if (this.isEdit === true) {
					uni.showModal({
						title: '删除',
						content: '是否永久删除？',
						success: (res) => {
							if (res.confirm) {
								// console.log('用户点击确定');
								deleteUser(this.id).then(res => {
									console.log(res)
									uni.showToast({
										title: res.msg,
										icon: "none"
									})
									if (res.code !== 1) {
										return
									} else {
										setTimeout(() => {
											var item = true; //item为要传的值
											var pages = getCurrentPages();
											var prevPage = pages[pages.length - 2];
											prevPage.delete = item;
											uni.navigateBack()
										}, 500)
									}

								})

							} else if (res.cancel) {
								// console.log('用户点击取消');
								uni.showToast({
									title: "取消删除",
									icon: "none"
								})
								return
							}
						}
					})
				} else {
					this.isEdit = true
				}
			}
		}
	};
</script>

<style lang="scss" scoped>
	.navbar-right {
		padding: 0px 40rpx;
		color: #ffffff;
	}

	.bg-box {
		height: 400rpx;
		// height: 50%;
		background-color: #5c92ff;
		padding: 0rpx 30rpx;
		margin-bottom: 200rpx;

		.img-box {
			text-align: center;
			
			.img-header {
				width: 234rpx;
				height: 234rpx;
				border-radius: 117rpx;
			}

		}

		.info-box {
			background-color: #ffffff;
			border-radius: 10rpx;
			margin-top: 40rpx;
			padding: 20rpx 40rpx;

			.info-left {
				font-size: 30rpx;
				font-weight: normal;
				font-stretch: normal;
				line-height: 40rpx;
				letter-spacing: 1rpx;
				color: #b1b8c8;
				padding: 20rpx 0px;
			}

			.info-right {
				font-size: 30rpx;
				font-weight: normal;
				font-stretch: normal;
				line-height: 40rpx;
				letter-spacing: 1rpx;
				color: #2c3240;
				text-align: right;
				font-weight: bold;
				padding: 20rpx 0px;
			}
		}
	}

	.btn-box {
		padding: 30rpx;
		padding-top: 70rpx;

		// padding-top: 70rpx;
		.btn-item {
			// margin-bottom: 40rpx;
			margin-top: 20rpx;
		}
	}

	.edit {
		background-color: #00aaff;
		color: #FFFFFF;
	}

	.cancleD {
		background-color: #00aaff;
		color: white;
	}
</style>
